Ahao

Appearance

vitepress中使用不蒜子网站计数器

Tags:
技术博客搭建vue
🕒 Published at: 2 years ago

不蒜子 ​

shell
npm install busuanzi.pure.js --save
npm install busuanzi.pure.js --save

将计数器封装成组件 ​

直接在文件中import，但是我并不知道要引入哪个方法，所以使用*

js
// .vitepress\theme\components

<template>
    <div class="busuanzi">
        <span id="busuanzi_container_site_pv" style="display:none">
            本站总访问量
            <span id="busuanzi_value_site_pv"></span>次
            <span class="post-meta-divider">|</span>
        </span>
        <span id="busuanzi_container_site_uv" style="display:none">
            本站访客数
            <span id="busuanzi_value_site_uv"></span>人
        </span>
    </div>
</template>

<script>
    import  * as busuanzi from "busuanzi.pure.js"

</script>
// .vitepress\theme\components

<template>
    <div class="busuanzi">
        <span id="busuanzi_container_site_pv" style="display:none">
            本站总访问量
            <span id="busuanzi_value_site_pv"></span>次
            <span class="post-meta-divider">|</span>
        </span>
        <span id="busuanzi_container_site_uv" style="display:none">
            本站访客数
            <span id="busuanzi_value_site_uv"></span>人
        </span>
    </div>
</template>

<script>
    import  * as busuanzi from "busuanzi.pure.js"

</script>

使用计数器 ​

在需要的文件中import然后像vue组件一样使用模板slot即可使用

Last updated: